<template>
  <div class="container">
    <div class="container-content">
      <div class="title">
        <span>项目管理/项目详情</span>
        <span class="back-btn" @click="() => this.$router.back()"
          ><img src="../../assets/images/icon_comm_back.png" alt="" />返回</span
        >
      </div>
      <div class="content-box">
        <div class="step-box">
          <div
            v-for="item in leftTab"
            :key="item.check"
            :class="item.check == checkActive ? 'active' : ''"
            @click="checkTab(item.check)"
          >
            <span></span>{{ item.label }}
          </div>
        </div>
        <div class="step">
          <div class="right-box rigth-manage-info">
            <!-- 标题 基本信息-->
            <div ref="one">
              <div class="right-title">
                <img src="../../assets/images/icon_16_title.png" alt="" />
                基本信息
              </div>
              <el-descriptions border :column="1">
                <el-descriptions-item
                  label="项目名称"
                  label-class-name="descriptions-item-label"
                  content-class-name="descriptions-item-content"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{
                      AnnualDeclaration.entryName
                        ? AnnualDeclaration.entryName
                        : ""
                    }}</span
                  ><span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{
                      SupplementaryDeclaration.entryName
                        ? SupplementaryDeclaration.entryName
                        : ""
                    }}</span
                  ></el-descriptions-item
                >
              </el-descriptions>
              <el-descriptions border :column="3">
                <el-descriptions-item
                  label="项目性质"
                  label-class-name="descriptions-item-label cancel-border-top"
                  content-class-name="descriptions-item-content cancel-border-top"
                  >{{
                    nature == 0 ? "年度项目" : "增补项目"
                  }}</el-descriptions-item
                >
                <el-descriptions-item
                  label="项目类别"
                  label-class-name="descriptions-item-label cancel-border-top"
                  content-class-name="descriptions-item-content cancel-border-top"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{
                      AnnualDeclaration.projectCategory === "0"
                        ? "建设类（新开工）"
                        : AnnualDeclaration.projectCategory === "1"
                        ? "建设类（续建）"
                        : AnnualDeclaration.projectCategory === "2"
                        ? "购买服务类"
                        : AnnualDeclaration.projectCategory === "3"
                        ? "运维类"
                        : AnnualDeclaration.projectCategory === "4"
                        ? "其他"
                        : AnnualDeclaration.projectCategory
                    }}</span
                  >
                  <span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{
                      SupplementaryDeclaration.projectCategory === '0'
                        ? "建设类（新开工）"
                        : SupplementaryDeclaration.projectCategory === '1'
                        ? "建设类（续建）"
                        : SupplementaryDeclaration.projectCategory === '2'
                        ? "购买服务类"
                        : SupplementaryDeclaration.projectCategory === '3'
                        ? "运维类"
                        : SupplementaryDeclaration.projectCategory === '4'
                        ? "其他"
                        : ""
                    }}</span
                  >
                </el-descriptions-item>
                <el-descriptions-item
                  label="申报时间"
                  label-class-name="descriptions-item-label cancel-border-top"
                  content-class-name="descriptions-item-content cancel-border-top"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{ AnnualDeclaration.createTime?formatDate(AnnualDeclaration.createTime):'' }}</span
                  >
                  <span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{ SupplementaryDeclaration.createTime?formatDate(SupplementaryDeclaration.createTime):'' }}</span
                  ></el-descriptions-item
                >
                <el-descriptions-item
                  label="项目投资估算(万元)"
                  label-class-name="descriptions-item-label cancel-border-bottom"
                  content-class-name="descriptions-item-content cancel-border-bottom"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{ AnnualDeclaration.projectInvestmentEstimation }}</span
                  ><span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{
                      SupplementaryDeclaration.projectInvestmentEstimation
                    }}</span
                  ></el-descriptions-item
                >
                <el-descriptions-item
                  label="资金来源"
                  label-class-name="descriptions-item-label cancel-border-bottom"
                  content-class-name="descriptions-item-content cancel-border-bottom"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{
                      AnnualDeclaration.sourceOfFunds == "0" ? "区财政资金" : AnnualDeclaration.sourceOfFunds == "1" ? "其他" :""
                    }}</span
                  ><span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{
                      SupplementaryDeclaration.sourceOfFunds == "0"
                        ? "区财政资金"
                        :SupplementaryDeclaration.sourceOfFunds == "1"
                        ? "其他"
                        : ""
                    }}</span
                  ></el-descriptions-item
                >
              </el-descriptions>
              <el-descriptions border :column="1">
                <el-descriptions-item
                  label="项目建设理由"
                  label-class-name="descriptions-item-label descriptions-item-height"
                  content-class-name="descriptions-item-content descriptions-item-height"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >
                    {{ AnnualDeclaration.reasonsForProjectConstruction }}
                    </span
                  ><span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >
                    {{ SupplementaryDeclaration.reasonsForProjectConstruction }}
                    </span
                  ></el-descriptions-item
                >
                <el-descriptions-item
                  label="项目内容简介"
                  label-class-name="descriptions-item-label descriptions-item-height"
                  content-class-name="descriptions-item-content descriptions-item-height"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{ AnnualDeclaration.projectContentIntroduction }}</span
                  ><span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{
                      SupplementaryDeclaration.projectContentIntroduction
                    }}</span
                  ></el-descriptions-item
                >
                <el-descriptions-item
                  label="预期效果描述"
                  label-class-name="descriptions-item-label descriptions-item-height"
                  content-class-name="descriptions-item-content descriptions-item-height"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{ AnnualDeclaration.expectedEffectDescription }}</span
                  ><span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{
                      SupplementaryDeclaration.expectedEffectDescription
                    }}</span
                  ></el-descriptions-item
                >
                <el-descriptions-item
                  label="项目进展"
                  label-class-name="descriptions-item-label descriptions-item-height"
                  content-class-name="descriptions-item-content descriptions-item-height"
                  ><span
                    v-if="
                      AnnualDeclaration !== null || AnnualDeclaration != undefined
                    "
                    >{{ AnnualDeclaration.workCompletion }}</span
                  ><span
                    v-if="
                      SupplementaryDeclaration !== null ||
                      SupplementaryDeclaration != undefined
                    "
                    >{{
                      SupplementaryDeclaration.preliminaryWorkCompletion
                    }}</span
                  ></el-descriptions-item
                >
                <el-descriptions-item
                  label="增补凭证"
                  label-class-name="descriptions-item-label "
                  content-class-name="descriptions-item-content "
                  v-if="SupplementaryDeclaration&&SupplementaryDeclaration.supplementaryVoucherFile"
                >
                  <span
                      class="pointer blueColor"
                      @click="$download(SupplementaryDeclaration.supplementaryVoucherFile?SupplementaryDeclaration.supplementaryVoucherFile.fileUrl:'')"
                    ><img src="@/assets/images/tripartite/icon_files.png" v-show="SupplementaryDeclaration.supplementaryVoucherFile && SupplementaryDeclaration.supplementaryVoucherFile.fileName"/>
                    {{
                      SupplementaryDeclaration.supplementaryVoucherFile && SupplementaryDeclaration.supplementaryVoucherFile.fileName? SupplementaryDeclaration.supplementaryVoucherFile.fileName:''
                    }}
                    </span
                  ></el-descriptions-item
                >
                <el-descriptions-item
                  label="项目建议书"
                  label-class-name="descriptions-item-label"
                  content-class-name="descriptions-item-content "
                >
                  <section v-if="AnnualDeclaration">
                    <span
                      class="pointer blueColor"
                      @click="$download(AnnualDeclaration.projectProposalFile?AnnualDeclaration.projectProposalFile.fileUrl:'')"
                      v-if="AnnualDeclaration !== null ||
                        SupplementaryDeclaration != undefined">
                      <img v-if="AnnualDeclaration.projectProposalFile" src="@/assets/images/tripartite/icon_files.png"/>
                      {{AnnualDeclaration.projectProposalFile !=undefined ? AnnualDeclaration.projectProposalFile.fileName: ''}}
                    </span>
                  </section>
                  <section v-if="SupplementaryDeclaration">
                    <span
                      class="pointer blueColor"
                     @click="$download(SupplementaryDeclaration.projectProposalFile?SupplementaryDeclaration.projectProposalFile.fileUrl:'')"
                      v-if="
                        SupplementaryDeclaration !== null ||
                        SupplementaryDeclaration != undefined
                      "
                      ><img
                        src="@/assets/images/tripartite/icon_files.png"
                        v-if="SupplementaryDeclaration !== null ||
                        SupplementaryDeclaration != undefined"
                      />
                      {{ SupplementaryDeclaration.projectProposalFile !=undefined?SupplementaryDeclaration.projectProposalFile.fileName: '' }}
                      </span
                    >
                  </section>
                </el-descriptions-item
                >
            </el-descriptions>
            </div>
            <!-- 标题 联系方式-->
            <div ref="two">
              <div class="right-title">
                <img src="../../assets/images/icon_16_title.png" alt="" />
                联系方式
              </div>
              <el-descriptions border :column="2">
              <el-descriptions-item
                label="业主单位"
                label-class-name="descriptions-item-label"
                content-class-name="descriptions-item-content"
                ><span
                  v-if="
                    AnnualDeclaration !== null || AnnualDeclaration != undefined
                  "
                  >{{ AnnualDeclaration.constructionUnit }}</span
                ><span
                  v-if="
                    SupplementaryDeclaration !== null ||
                    SupplementaryDeclaration != undefined
                  "
                  >{{ SupplementaryDeclaration.constructionUnit }}</span
                ></el-descriptions-item
              >
              <el-descriptions-item
                label="责任科室"
                label-class-name="descriptions-item-label"
                content-class-name="descriptions-item-content"
                ><span
                  v-if="
                    AnnualDeclaration !== null || AnnualDeclaration != undefined
                  "
                  >{{ AnnualDeclaration.department }}</span
                ><span
                  v-if="
                    SupplementaryDeclaration !== null ||
                    SupplementaryDeclaration != undefined
                  "
                  >{{ SupplementaryDeclaration.department }}</span
                ></el-descriptions-item
              >
              <el-descriptions-item
                label="项目负责人"
                label-class-name="descriptions-item-label"
                content-class-name="descriptions-item-content"
                ><span
                  v-if="
                    AnnualDeclaration !== null || AnnualDeclaration != undefined
                  "
                  >{{ AnnualDeclaration.projectLeader }}</span
                ><span
                  v-if="
                    SupplementaryDeclaration !== null ||
                    SupplementaryDeclaration != undefined
                  "
                  >{{ SupplementaryDeclaration.projectLeader }}</span
                ></el-descriptions-item
              >
              <el-descriptions-item
                label="负责人电话"
                label-class-name="descriptions-item-label"
                content-class-name="descriptions-item-content"
                ><span
                  v-if="
                    AnnualDeclaration !== null || AnnualDeclaration != undefined
                  "
                  >{{ AnnualDeclaration.telephoneNumber }}</span
                ><span
                  v-if="
                    SupplementaryDeclaration !== null ||
                    SupplementaryDeclaration != undefined
                  "
                  >{{ SupplementaryDeclaration.telephoneNumber }}</span
                ></el-descriptions-item
              >
              <el-descriptions-item
                label="项目联系人"
                label-class-name="descriptions-item-label"
                content-class-name="descriptions-item-content"
                ><span
                  v-if="
                    AnnualDeclaration !== null || AnnualDeclaration != undefined
                  "
                  >{{ AnnualDeclaration.projectContact }}</span
                ><span
                  v-if="
                    SupplementaryDeclaration !== null ||
                    SupplementaryDeclaration != undefined
                  "
                  >{{ SupplementaryDeclaration.projectContact }}</span
                ></el-descriptions-item
              >
              <el-descriptions-item
                label="联系人电话"
                label-class-name="descriptions-item-label"
                content-class-name="descriptions-item-content"
                ><span
                  v-if="
                    AnnualDeclaration !== null || AnnualDeclaration != undefined
                  "
                  >{{ AnnualDeclaration.contactTelephone }}</span
                ><span
                  v-if="
                    SupplementaryDeclaration !== null ||
                    SupplementaryDeclaration != undefined
                  "
                  >{{ SupplementaryDeclaration.contactTelephone }}</span
                ></el-descriptions-item
              >
            </el-descriptions>
            </div>
            <!-- 添加div用于获取点击方案申报 滚动条滚动到相应位置 -->
            <div ref="tabsTwo">
              <!-- 标题 方案申报-->
              <div ref="three" v-if="schemeDeclaration">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  方案申报
                </div>
                <el-descriptions border :column="2">
                  <el-descriptions-item
                    :span="2"
                    label="设计单位"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="
                        schemeDeclaration !== null || schemeDeclaration != undefined
                      "
                      >{{
                        schemeDeclaration.designUnit
                          ? schemeDeclaration.designUnit
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item :span="1"
                    label="评标方法" 
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content">
                    <!-- {{schemeDeclaration ? schemeDeclaration.assessmentMethod === '0' ? '综合评分法' 
                    : (schemeDeclaration.assessmentMethod === '1' 
                    ? '最低评标价法' 
                    : schemeDeclaration.assessmentMethod === '2' 
                    ? '性价比法' 
                    :schemeDeclaration.assessmentMethod === '3' 
                    ? '其他' 
                    :'')
                    : ''}} -->
                    {{schemeDeclaration ? schemeDeclaration.assessmentMethod : ''}}
                  </el-descriptions-item>
                  <el-descriptions-item :span="1"
                    label="项目代码" 
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content">
                    {{schemeDeclaration ? schemeDeclaration.projectCode : ''}}
                  </el-descriptions-item>
                  <el-descriptions-item
                    :span="2"
                    label="系统架构简述"
                    label-class-name="descriptions-item-label descriptions-item-height"
                    content-class-name="descriptions-item-content descriptions-item-height"
                    ><span
                      v-if="
                        schemeDeclaration !== null || schemeDeclaration != undefined
                      "
                      >{{
                        schemeDeclaration.systemArchitecture
                          ? schemeDeclaration.systemArchitecture
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <!-- <el-descriptions-item
                    :span="2"
                    label="可行性研究报告"
                    label-class-name="descriptions-item-label "
                    content-class-name="descriptions-item-content"
                    >
                    <section v-if="schemeDeclaration">
                      <span v-if="schemeDeclaration.researchReportFile" @click="$download(schemeDeclaration.researchReportFile?schemeDeclaration.researchReportFile.fileUrl:'')" class="pointer blueColor">
                        <img v-if="schemeDeclaration.researchReportFile.fileName" src="@/assets/images/tripartite/icon_files.png" />
                        {{schemeDeclaration.researchReportFile.fileName || ''}}
                      </span>
                    </section>
                  </el-descriptions-item> -->
                  <el-descriptions-item
                    :span="2"
                    label="可研批复(立项文件)"
                    label-class-name="descriptions-item-label "
                    content-class-name="descriptions-item-content "
                    >
                    <section v-if="schemeDeclaration">
                      <span v-if="schemeDeclaration.budgetProposalFile" @click="$download(schemeDeclaration.budgetProposalFile?schemeDeclaration.budgetProposalFile.fileUrl:'')" class="pointer blueColor">
                        <img v-if="schemeDeclaration.budgetProposalFile.fileName" src="@/assets/images/tripartite/icon_files.png" />
                        {{schemeDeclaration.budgetProposalFile.fileName || ''}}
                      </span>
                    </section>
                  </el-descriptions-item>
                  <el-descriptions-item
                    :span="2"
                    label="初设方案(可研代初设)"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    >
                    <section v-if="schemeDeclaration">
                      <span v-if="schemeDeclaration.preliminaryDesignSchemeFile" @click="$download(schemeDeclaration.preliminaryDesignSchemeFile?schemeDeclaration.preliminaryDesignSchemeFile.fileUrl:'')" class="pointer blueColor">
                        <img v-if="schemeDeclaration.preliminaryDesignSchemeFile.fileName" src="@/assets/images/tripartite/icon_files.png" />
                        {{schemeDeclaration.preliminaryDesignSchemeFile.fileName || ''}}
                      </span>
                    </section>
                  </el-descriptions-item>
                  <!-- <el-descriptions-item
                    :span="2"
                    label="预算方案"
                    label-class-name="descriptions-item-label "
                    content-class-name="descriptions-item-content"
                    >
                    <section v-if="schemeDeclaration">
                      <span v-if="schemeDeclaration.budgetProgrammeFile" @click="downloadSomeFile(schemeDeclaration.budgetProgrammeFile)" class="pointer blueColor">
                        <img v-if="schemeDeclaration.budgetProgrammeFile.fileName" src="@/assets/images/tripartite/icon_files.png" />
                        {{schemeDeclaration.budgetProgrammeFile.fileName || ''}}
                      </span>
                    </section>
                  </el-descriptions-item> -->
                  <!-- <el-descriptions-item
                    :span="2"
                    label="云资源需求清单"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    >
                    <section v-if="schemeDeclaration">
                      <span v-if="schemeDeclaration.cloudResourceApplicationFile" class="pointer blueColor" @click="downloadSomeFile(schemeDeclaration.cloudResourceApplicationFile)">
                        <img v-if="schemeDeclaration.cloudResourceApplicationFile.fileName" src="@/assets/images/tripartite/icon_files.png"/>
                        {{schemeDeclaration.cloudResourceApplicationFile.fileName || ''}}
                      </span>
                    </section>
                  </el-descriptions-item> -->
                </el-descriptions>
              </div>
              <!-- 系统信息 -->
              <div v-if="systemInfoList && systemInfoList.length > 0">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  系统信息
                </div>
                <el-table :data="systemInfoList" border>
                  <el-table-column
                    label="系统名称"
                    align="center"
                    prop="systemName"
                    width="288"
                  />
                  <el-table-column
                    label="系统描述"
                    align="center"
                    prop="systemDesc"
                    :show-overflow-tooltip="true"
                  />
                  <el-table-column
                    label="是否申请云资源"
                    align="center"
                    prop="appIsCloud"
                    width="288"
                  >
                  <template slot-scope="scope">
                    <span>{{scope.row.appIsCloud==='0'?'否':scope.row.appIsCloud==='1'?'是':''}}</span>
                  </template>
                  </el-table-column>
                </el-table>
              </div>
              <!-- 政务资源目录清单 -->
              <div v-if=" governmentDataResourcesVoList &&
                  governmentDataResourcesVoList.length > 0
                "
                >
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  政务数据资源目录清单
                </div>
                <el-table :data="governmentDataResourcesVoList" border>
                <el-table-column
                  label="信息资源名称"
                  align="center"
                  prop="informationResourceName"
                  :show-overflow-tooltip="true"
                  width="228"
                  >
                </el-table-column>
                <el-table-column
                  label="信息资源来源系统"
                  align="center"
                  prop="informationResourceSourceSystem"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="信息资源源代码"
                  align="center"
                  prop="informationResourceCode"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="信息资源提供方"
                  align="center"
                  prop="informationResourceProvider"
                  width="228"
                  :show-overflow-tooltip="true"
                >
                </el-table-column>
                <el-table-column
                  label="提供方内部部门"
                  align="center"
                  prop="providersInternalDepartment"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="资源提供方代码"
                  align="center"
                  prop="resourceProviderCode"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="信息资源摘要"
                  align="center"
                  prop="summaryOfInformationResources"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="信息资源格式分类"
                  align="center"
                  prop="classificationOfInformationResourceFormats"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="信息资源格式类型"
                  align="center"
                  prop="informationResourceFormatType"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="其他类型资源格式描述"
                  align="center"
                  prop="other"
                  width="228"
                  :show-overflow-tooltip="true"
                  > 
                </el-table-column>
                <el-table-column
                  label="信息项名称"
                  align="center"
                  prop="informationItemName"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="数据类型"
                  align="center"
                  prop="typeOfData"
                  width="228"
                  >
                </el-table-column>
                <el-table-column
                  label="数据长度"
                  align="center"
                  prop="dataLength"
                  width="120"
                  :show-overflow-tooltip="true"
                    >
                </el-table-column>
                <el-table-column
                  label="共享类型"
                  align="center"
                  prop="shareType"
                  width="120"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label="共享条件"
                  align="center"
                  prop="sharingConditions"
                  width="228"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label=" 共享方式分类"
                  align="center"
                  prop="sharingModeClassification"
                  width="120"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label=" 共享方式类型"
                  align="center"
                  prop="sharingModeType"
                  width="120"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label=" 是否向社会开放"
                  align="center"
                  prop="isOpen"
                  width="120"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label=" 开放条件"
                  align="center"
                  prop="openConditions"
                  width="120"
                  :show-overflow-tooltip="true"
                  >
                </el-table-column>
                <el-table-column
                  label=" 更新周期"
                  align="center"
                  prop="updateCycle"
                  width="120"
                  :show-overflow-tooltip="true"
                >
                </el-table-column>
                <el-table-column
                  label=" 发布日期"
                  align="center"
                  prop="releaseDate"
                  width="228"
                  :show-overflow-tooltip="true"
                >
                </el-table-column>
                <el-table-column
                  label=" 平台目录标识"
                  align="center"
                  prop="platformDirectoryId"
                  width="120"
                  :show-overflow-tooltip="true"
                >
                </el-table-column>
                </el-table>
              </div>
              <!-- 标题 云资源需求-->
              <div v-if="
                  cloudResourceRequirementVoList &&
                  cloudResourceRequirementVoList.length > 0
                "
                >
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  云资源需求
                </div>
                <el-table :data="cloudResourceRequirementVoList" border>
                  <el-table-column
                    label="资源名称"
                    align="center"
                    prop="cloudServerName"
                  />
                  <el-table-column
                    label="cpu"
                    align="center"
                    prop="cpu"
                    :show-overflow-tooltip="true"
                  />
                  <el-table-column label="内存(G)" align="center" prop="memory">
                  </el-table-column>
                  <el-table-column
                    label="硬盘(G)"
                    align="center"
                    prop="hardDisk"
                  />
                  <el-table-column label="数量" align="center" prop="number" />
                </el-table>
              </div>
              <!-- 标题 物联设备信息-->
              <div v-if="iotDeviceInfoVoList && iotDeviceInfoVoList.length > 0">
                <div class="right-title right-title1">
                  <span
                    ><img src="../../assets/images/icon_16_title.png" alt="" />
                    物联设备信息</span
                  ><span v-if="!showEdit"
                    ><el-button
                      @click="
                        () =>
                          this.$router.push(
                            {
                              path: '/equipmentMonitor',
                              query: {
                                proid: this.proid
                              }
                            }, 
                          )
                      "
                      >集约化建设检测</el-button
                    ></span
                  >
                </div>
                <el-table
                  :data="iotDeviceInfoVoList"
                  border
                  :cell-style="columnStyle"
                >
                  <el-table-column
                    label="产品名称"
                    align="center"
                    prop="productName"
                  />
                  <el-table-column
                    label="参数"
                    align="center"
                    prop="deviceParam"
                    :show-overflow-tooltip="true"
                  />
                  <el-table-column label="数量" align="center" prop="deviceNum">
                  </el-table-column>
                  <el-table-column
                    label="建设地点"
                    align="center"
                    prop="constructionSite"
                    width="288"
                  />
                  <el-table-column
                    label="设备功能"
                    align="center"
                    prop="deviceFunction"
                  />
                  <el-table-column
                    label="建设方式"
                    align="center"
                    prop="constructionWay"
                  />
                </el-table>
              </div>
              <!-- 标题 三方审批结果-->
              <div v-if="tableData.approvalDatabase&&tableData.approvalDatabase.length>0">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  三方审批结果
                </div>
                <el-descriptions border :column="2">
                  <el-descriptions-item
                    label="审批结果"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span> 已通过</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="专家签字扫描件"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    >
                    <span><img src="../../assets/images/icon_form_file.png" alt=""></span>
                  </el-descriptions-item>
                </el-descriptions>
                <!-- <div class="table-box">
                  <div>
                    <span class="table-header table-header2">审批结果</span>
                    <span class="table-body table-body2">
                      <img src="../../assets/images/icon_form_file.png" alt=""
                    /></span>
                  </div>
                  <div>
                    <span class="table-header table-header2">专家签字扫描件</span>
                    <span class="table-body table-body2">
                      <img src="../../assets/images/icon_form_file.png" alt=""
                    /></span>
                  </div>
                </div> -->
              </div>
              <!-- 标题 初设及概算方案批复-->
              <div v-if="finance">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  初设及概算方案批复
                </div>
                <el-descriptions border :column="1">
                <el-descriptions-item
                  label="初设及概算方案批复"
                  label-class-name="descriptions-item-label "
                  content-class-name="descriptions-item-content"
                  >
                  <section v-if="finance">
                    <span v-if="finance.approvalAnnexFile" class="pointer blueColor" @click="$download(finance.approvalAnnexFile?finance.approvalAnnexFile.fileUrl:'')">
                      <img v-if="finance.approvalAnnexFile.fileName" src="@/assets/images/tripartite/icon_files.png"/>
                      {{finance.approvalAnnexFile.fileName}}
                    </span>
                  </section>
                </el-descriptions-item>
                <!-- <el-descriptions-item
                  label="区财政局审批结果"
                  label-class-name="descriptions-item-label"
                  content-class-name="descriptions-item-content"
                  >
                  <section v-if="finance">
                    <span v-if="finance.approvalFinanceFile" class="pointer blueColor" @click="downloadSomeFile(finance.approvalFinanceFile)">
                      <img v-if="finance.approvalFinanceFile.fileName" src="@/assets/images/tripartite/icon_files.png"/>
                      {{finance.approvalFinanceFile.fileName}}
                    </span>
                  </section>
                </el-descriptions-item> -->
              </el-descriptions>
              </div>
            </div>
            <!-- 添加div用于获取点击项目实施 滚动条滚动到相应位置 -->
            <div ref="tabsThree">
              <!-- 标题 合同信息-->
              <div ref="five" v-if="contractInformation">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  合同信息
                </div>
                <el-descriptions border :column="3">
                  <el-descriptions-item
                    label="合同名称"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.contractName
                          ? contractInformation.contractName
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="合同编号"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{ contractInformation.contractNo }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="合同金额(万元)"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.contractAmount
                          ? contractInformation.contractAmount
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="甲方"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.partyA ? contractInformation.partyA : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="甲方联系人"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.contactPersonA
                          ? contractInformation.contactPersonA
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="甲方联系电话"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.contactNumberA
                          ? contractInformation.contactNumberA
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="乙方"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.partyB ? contractInformation.partyB : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="乙方联系人"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.contactPersonB
                          ? contractInformation.contactPersonB
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="乙方联系电话"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{
                        contractInformation.contactNumberB
                          ? contractInformation.contactNumberB
                          : ""
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="签约时间"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="contractInformation"
                      >{{ contractInformation.signingTime?formatDate(contractInformation.signingTime):'' }}</span
                    ></el-descriptions-item
                  >
                  
                </el-descriptions>
                <el-descriptions border :column="1">
                  <el-descriptions-item
                    label="招标公告网址"
                    label-class-name="descriptions-item-label cancel-border-top"
                    content-class-name="descriptions-item-content cancel-border-top"
                  ><span
                    v-if="
                      contractInformation !== null ||
                      contractInformation != undefined
                    "
                    >{{
                      contractInformation.tenderAnnouncementWebsite
                    }}</span
                  ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="中标公告网址"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span
                      v-if="
                        contractInformation !== null ||
                        contractInformation != undefined
                      "
                      >{{
                        contractInformation.websiteOfBidWinningAnnouncement
                      }}</span
                    ></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="招标公告文件"
                    label-class-name="descriptions-item-label cancel-border-top"
                    content-class-name="descriptions-item-content cancel-border-top"
                    ><span
                      class="pointer blueColor"
                      @click="
                        $download(
                          contractInformation.tenderAnnouncementFile?contractInformation.tenderAnnouncementFile.fileUrl:''
                        )
                      "
                      v-if="
                        contractInformation !== null ||
                        contractInformation != undefined
                      "
                      ><img src="@/assets/images/tripartite/icon_files.png" v-show="contractInformation.tenderAnnouncementFile&&contractInformation.tenderAnnouncementFile.fileName"/>{{
                        contractInformation.tenderAnnouncementFile
                          ? contractInformation.tenderAnnouncementFile.fileName
                          : ""
                      }}
                    </span>
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions border :column="1">
                  <el-descriptions-item
                    label="中标公告文件"
                    label-class-name="descriptions-item-label cancel-border-top"
                    content-class-name="descriptions-item-content cancel-border-top"
                    ><span
                      class="pointer blueColor"
                      @click="
                        $download(
                          contractInformation.bidWinningAnnouncementFile?contractInformation.bidWinningAnnouncementFile.fileUrl:''
                        )
                      "
                      v-if="
                        contractInformation !== null ||
                        contractInformation != undefined
                      "
                      ><img src="@/assets/images/tripartite/icon_files.png" v-show="contractInformation.bidWinningAnnouncementFile&&contractInformation.bidWinningAnnouncementFile.fileName"/>{{
                        contractInformation.bidWinningAnnouncementFile
                          ? contractInformation.bidWinningAnnouncementFile.fileName
                          : ""
                      }}
                    </span>
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions border :column="1">
                  <el-descriptions-item
                    label="合同扫描件(带公章)"
                    label-class-name="descriptions-item-label cancel-border-top"
                    content-class-name="descriptions-item-content cancel-border-top"
                    >
                    <section v-if="contractInformation">
                      <span v-if="contractInformation.scannedCopyOfContract" class="pointer blueColor" @click="$download(contractInformation.scannedCopyOfContract?contractInformation.scannedCopyOfContract.fileUrl:'')">
                        <img v-if="contractInformation.scannedCopyOfContract.fileName" src="@/assets/images/tripartite/icon_files.png"/>
                        {{contractInformation.scannedCopyOfContract.fileName || ''}}
                      </span>
                    </section>
                    </el-descriptions-item
                  >
                </el-descriptions>
              </div>
              <!-- 标题 里程碑信息-->
              <div ref="six" v-if="milestoneList.length > 0">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  里程碑信息
                </div>
                <el-table :data="milestoneList" border :cell-style="columnStyle">
                  <el-table-column
                    label="里程碑名称"
                    align="center"
                    prop="milestoneName"
                    :show-overflow-tooltip="true"
                  />
                  <el-table-column
                    label="计划完成时间"
                    align="center"
                    prop="plannedCompletionTime"
                  >
                    <template slot-scope="scope">
                      <span>{{formatDate(scope.row.plannedCompletionTime)}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column
                    label="实际完成时间"
                    align="center"
                    prop="actualCompletionTime"
                  >
                    <template slot-scope="scope">
                      <span>{{formatDate(scope.row.actualCompletionTime)}}</span>
                    </template>
                </el-table-column>
                  <el-table-column
                    label="完成标准"
                    align="center"
                    prop="completionCriteria"
                    :show-overflow-tooltip="true"
                  />
                  <el-table-column label="附件" align="center" prop="enclosureFile" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                      <span v-if="scope.row.enclosureFile" @click="$download(scope.row.enclosureFile?scope.row.enclosureFile.fileUrl:'')" class="pointer blueColor downloadSpan">
                        <img v-if="scope.row.enclosureFile.fileName" src="@/assets/images/tripartite/icon_files.png"/>
                        {{ scope.row.enclosureFile.fileName }}
                      </span>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </div>
            <!-- 添加div用于获取点击项目验收 滚动条滚动到相应位置 -->
            <div ref="tabsFour">  
              <!-- 标题  合规审查-->
              <div ref="seven" v-if="compliance">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  合规审查
                </div>
                <el-descriptions border :column="2">
                  <el-descriptions-item
                    label="试运行开始时间"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span v-if="compliance !== null || compliance != undefined">{{
                      compliance.tryTime ? formatDate(compliance.tryTime) : ""
                    }}</span></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="项目部署"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    >
                    <!-- <span v-if="compliance !== null || compliance != undefined">{{
                      compliance.deploymentMode==0 ? '政务云部署'
                      :compliance.deploymentMode==1 ? '私有云部署'
                      :compliance.deploymentMode==2 ? '公有云部署'
                      :compliance.deploymentMode==3 ? '自建机房部署'  
                      : compliance.deploymentMode
                    }}</span> -->
                    <span v-if="compliance !== null || compliance != undefined">
                      {{compliance.deploymentMode}}
                    </span>
                    </el-descriptions-item
                  >
                  <el-descriptions-item
                    label="安全评测"
                    label-class-name="descriptions-item-label cancel-border-bottom"
                    content-class-name="descriptions-item-content cancel-border-bottom"
                    >
                    <!-- <span v-if="compliance !== null || compliance != undefined">{{
                      compliance.safetyEvaluation ==0? '未评测' 
                      : compliance.safetyEvaluation ==1?'三级等保评测'
                      : compliance.safetyEvaluation
                    }}</span> -->
                    <span v-if="compliance !== null || compliance != undefined">
                      {{compliance.safetyEvaluation}}
                    </span>
                  </el-descriptions-item
                  >
                  <el-descriptions-item
                    label="是否按照方案实现数据源共享"
                    label-class-name="descriptions-item-label cancel-border-bottom"
                    content-class-name="descriptions-item-content cancel-border-bottom"
                    ><span v-if="compliance !== null || compliance != undefined">{{
                      compliance.isAccord == 0 ? '是' : "否"
                    }}</span></el-descriptions-item
                  >
              </el-descriptions>
                <el-descriptions border :column="1">
                  <el-descriptions-item
                    label="系统整合"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span v-if="compliance !== null || compliance != undefined">{{
                      compliance.systemIntegration
                    }}</span></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="试运行效果描述"
                    label-class-name="descriptions-item-label descriptions-item-height"
                    content-class-name="descriptions-item-content descriptions-item-height"
                    ><span v-if="compliance !== null || compliance != undefined">{{
                      compliance.tryEffectDescription
                        ? compliance.tryEffectDescription
                        : ""
                    }}</span></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="试运行效果证明材料"
                    label-class-name="descriptions-item-label "
                    content-class-name="descriptions-item-content "
                    >
                    <section v-if="compliance">
                      <span class="pointer blueColor downloadSpan" v-if="compliance.tryEffectDescriptionStuffFile" @click="$download(compliance.tryEffectDescriptionStuffFile?compliance.tryEffectDescriptionStuffFile.fileUrl:'')">
                        <img src="@/assets/images/tripartite/icon_files.png" v-show="compliance.tryEffectDescriptionStuffFile&&compliance.tryEffectDescriptionStuffFile.fileName"/>
                        {{compliance.tryEffectDescriptionStuffFile.fileName || ''}}
                      </span>
                    </section>
                  </el-descriptions-item>
                </el-descriptions>
              </div>
              <!-- 标题 初验信息-->
              <div ref="eight" v-if="preliminaryInformation">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  初验信息
                </div>
                <el-descriptions border :column="3">
                  <el-descriptions-item
                    label="初验时间"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span>{{
                      preliminaryInformation.initialAcceptanceTime
                        ? formatDate(preliminaryInformation.initialAcceptanceTime)
                        : ""
                    }}</span></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="机构名称"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span>{{
                      preliminaryInformation.organizationName ? preliminaryInformation.organizationName : ""
                    }}</span></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="初验通过凭证"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    >
                    <span v-if="preliminaryInformation.certificateFile" class="pointer blueColor" @click="$download(contractInformation.scannedCopyOfContract?contractInformation.scannedCopyOfContract.fileUrl:'')">
                      <img v-if="preliminaryInformation.certificateFile.fileName" src="@/assets/images/tripartite/icon_files.png">
                      {{preliminaryInformation.certificateFile.fileName || ''}}
                    </span>
                  </el-descriptions-item>
                </el-descriptions>
              </div>
              <!-- 标题  终验信息-->
              <div ref="nine" v-if="lastCheck">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  终验信息
                </div>
                <el-descriptions border :column="3">
                  <el-descriptions-item
                    label="终验时间"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span>{{
                      lastCheck.lastAdoptTime ? formatDate(lastCheck.lastAdoptTime) : ""
                    }}</span></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="机构名称"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    ><span>{{
                      lastCheck.checkName ? lastCheck.checkName : ""
                    }}</span></el-descriptions-item
                  >
                  <el-descriptions-item
                    label="终验通过凭证"
                    label-class-name="descriptions-item-label"
                    content-class-name="descriptions-item-content"
                    >
                    <span v-if="lastCheck.lastAdoptVoucherFile" class="pointer blueColor" @click="$download(lastCheck.lastAdoptVoucherFile?lastCheck.lastAdoptVoucherFile.fileUrl:'')">
                      <img v-if="lastCheck.lastAdoptVoucherFile.fileName" src="@/assets/images/tripartite/icon_files.png">
                      {{lastCheck.lastAdoptVoucherFile.fileName || ''}}
                    </span>
                  </el-descriptions-item>
              </el-descriptions>
              </div>
              <!-- 标题 绩效评价-->
              <div v-if="tableData.Score">
                <div class="right-title">
                  <img src="../../assets/images/icon_16_title.png" alt="" />
                  绩效评价
                </div>
                <div class="table-box">
                  <div class="tips2">
                    <span class="table-header">综合得分</span>
                    <span class="table-body">{{ tableData.Score }}</span>
                  </div>
                </div>
              </div>
            </div>
            <!-- 标题 审核进程-->
            <div ref="ten" v-if="!showEdit">
              <div class="right-title">
                <img src="../../assets/images/icon_16_title.png" alt="" />
                审核进程
              </div>
              <el-table
                :data="approvalsList"
                border
                :cell-style="columnStyle"
                :span-method="objectSpanMethod"
              >
                <el-table-column
                  label="项目阶段"
                  align="center"
                  prop="approvalStage"
                />
                <el-table-column
                  label="节点"
                  align="center"
                  prop="approvalNode"
                  :show-overflow-tooltip="true"
                />
                <el-table-column
                  label="开始时间"
                  align="center"
                  prop="startTime"
                  :show-overflow-tooltip="true"
                />
                <el-table-column
                  label="结束时间"
                  align="center"
                  prop="endTime"
                  :show-overflow-tooltip="true"
                />
                <el-table-column
                  label="操作人"
                  align="center"
                  prop="approvalOperator"
                />
                <el-table-column
                  label="状态"
                  align="center"
                  prop="approvalStatusName"
                />
                <el-table-column label="操作" align="center">
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      :disabled="scope.row.approvalOperation == '/'"
                    >
                    </el-button>
                    <el-button
                      size="mini"
                      type="text"
                      v-if="['初验备案', '终验备案'].indexOf(scope.row.approvalNode) > -1 && scope.row.approvalStatusName === '待提交'"
                      @click="createMsg(scope.row)">催办</el-button>
                    <!-- 审核 --- 22 三方结果审核   34 合规审查-->
                    <!-- <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="
                        scope.row.approvalStatus == 1 ||
                        scope.row.approvalStatus == 22 ||
                        scope.row.approvalStatus == 34 ||
                        scope.row.approvalStatus == 49
                      "
                    >
                      审核
                    </el-button> -->
                    <!-- <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="scope.row.approvalStatus == 7"
                      :disabled="type == 1"
                      v-hasPermi="['manage:details:extractingExpert']"
                    >
                      抽取专家
                    </el-button> -->
                    <!-- <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row, 1)"
                      v-if="scope.row.approvalStatus == 7"
                      :disabled="type == 1"
                      v-hasPermi="['manage:details:turnThree']"
                    >
                      转派三方
                    </el-button> -->
                    <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="scope.row.approvalStatus == 9"                      
                    >
                      专家管理
                    </el-button>
                    <!-- 16 现场论证 13 意见汇总 -->
                    <!-- <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="
                        scope.row.approvalStatus == 16 ||
                        scope.row.approvalStatus == 13 ||
                        scope.row.approvalStatus == 57
                      "
                    >
                      审批
                    </el-button> -->
                    <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="scope.row.approvalStatus == 14"
                    >
                      查看评审会议详情
                    </el-button>
                    <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="
                        scope.row.approvalStatus == 41 ||
                        scope.row.approvalStatus == 42
                      "
                    >
                      查看详情
                    </el-button>
                    <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="
                        scope.row.approvalStatus == 11 ||
                        scope.row.approvalStatus == 12
                      "
                    >
                      查看
                    </el-button>
                    <!-- <el-button
                      size="mini"
                      type="text"
                      @click="handDialog(scope.row)"
                      v-if="
                        scope.row.approvalStatus == 60
                      "
                    >
                      安排评审会议
                    </el-button> -->
                  </template>
                </el-table-column>
                <el-table-column
                  label="审批意见"
                  align="center"
                  prop="approvalOpinion"
                  show-overflow-tooltip
                />
                <el-table-column
                  label="资料库"
                  align="center"
                  prop="relationFile"
                >
                <template slot-scope="scope">
                  <span v-if="scope.row.approvalNode === '现场论证'">
                    <ArgumentFileDialog  v-if="scope.row.relationFile && scope.row.relationFile.length < 1 " :index="scope.$index" :approvalId="scope.row.approvalId"></ArgumentFileDialog>
                  </span>
                  <span>
                     <el-tooltip class="item" effect="dark" v-for="item in scope.row.relationFile" :key="item.id" :content="item.fileName" :placement="scope.row.approvalNode === '现场论证'?'top':'left'">
                      <span v-if="scope.row.approvalNode === '现场论证'">
                        <span v-if="item.fileName" style="color:#3171ee" class="files-upload" @click="$download(item.fileUrl)">{{item.fileName}}</span>
                        <i v-if="item.fileName" class="el-icon-error icon-del" @click="handleDel(scope.row.approvalId)"></i>
                      </span>
                      <span v-else style="color:#3171ee" class="files-box" @click="$download(item.fileUrl)">{{item.fileName}}</span>
                    </el-tooltip>
                  </span>
                 
                </template>
                </el-table-column>
              </el-table>
            </div>
            <!-- 标题 审批按钮 -->
            <div ref="handleBtn" style="marginTop:22px" v-if="!showEdit">
              <el-button type="primary" size="small" @click="handleAudit" :disabled="isDisable" v-hasPermi="['manage:details:audit']">审批</el-button>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 现场论证 -->
    <ArgumentDialog
      :argumentShow.sync="argumentShow"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></ArgumentDialog>
    <!-- 合规审查 -->
    <ComplianceDialog
      :complianceShow.sync="complianceShow"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></ComplianceDialog>
    <!-- 申报审核 -->
    <DeclareDialog
      :declareShow.sync="declareShow"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></DeclareDialog>
    <!-- 会议详情 -->
    <MeetingDialog
      :meetingShow.sync="meetingShow"
      :proid="proid"
      :approvalId="approvalId"
      @changeShowDialog="changeShowDialog"
    ></MeetingDialog>
    <!-- 方案修改 -->
    <EditDialog
      :editShow.sync="editShow"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></EditDialog>
    <!-- 在线预审 -->
    <OnlineDialog
      :onlineShow.sync="onlineShow"
      :proid="proid"
      :timeData="timeData"
      @changeShowDialog="changeShowDialog"
    ></OnlineDialog>
    <!-- 三方审批结果 -->
    <ResultsDialog
      :resultsShow.sync="resultsShow"
      :proid="proid"
      :approvalId="approvalId"
      @changeShowDialog="changeShowDialog"
      :show="show"
    ></ResultsDialog>
    <!-- 意见汇总 -->
    <SummaryDialog
      :summaryShow.sync="summaryShow"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></SummaryDialog>
    <!--转派三方 -->
    <TurntosendDialog
      :turntosendShow.sync="turntosendShow"
      :turntosendName="turntosendName"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></TurntosendDialog>
    <!-- 安排评审会议 -->
    <ArrangeMeeting
      :arrangeMeetingShow.sync="arrangeMeetingShow"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></ArrangeMeeting>
    <!-- 申报审核，转年度 -->
    <ProjectAuditDialog
      :projectAuditShow.sync="projectAuditShow"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></ProjectAuditDialog>
    <!-- 抽取专家，转三方 -->
    <TurnThreeAuditDialog
      :turnThreeAuditDialogShow.sync="turnThreeAuditDialogShow"
      :auditData="auditData"
      :reviewType="reviewType"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></TurnThreeAuditDialog>
    <!-- 催办弹窗 -->
    <CreateMsgDialog
      :createMsgDialogShow.sync="createMsgDialogShow"
      :auditData="auditData"
      :proid="proid"
      @changeShowDialog="changeShowDialog"
    ></CreateMsgDialog>
  </div>
</template>
<script>
import { getManageDetails, getManagement, createMsg, delFile } from "../../api/manage/manage";
import ArgumentDialog from "./components/argumentDialog";
import ComplianceDialog from "./components/complianceDialog";
import DeclareDialog from "./components/declareDialog";
import MeetingDialog from "./components/meetingDialog";
import OnlineDialog from "./components/onlineDialog";
import ResultsDialog from "./components/resultsDialog";
import SummaryDialog from "./components/summaryDialog";
import TurntosendDialog from "./components/turntosendDialog";
import EditDialog from "./components/editDialog";
import ArrangeMeeting from "./components/arrangeMeeting";
import ProjectAuditDialog from "./components/projectAuditDialog"
import TurnThreeAuditDialog from "./components/turnThreeAuditDialog"
import CreateMsgDialog from "./components/createMsgDialog"
import ArgumentFileDialog from "@/views/components/argumentFileDialog";
export default {
  components: {
    ArgumentDialog,
    ComplianceDialog,
    DeclareDialog,
    MeetingDialog,
    OnlineDialog,
    ResultsDialog,
    SummaryDialog,
    TurntosendDialog,
    EditDialog,
    ArrangeMeeting,
    ProjectAuditDialog,
    TurnThreeAuditDialog,
    CreateMsgDialog,
    ArgumentFileDialog
  },
  data() {
    return {
      approvalOpinion: '', //三方审核意见
      showEdit: false,
      argumentShow: false, //现场论证
      complianceShow: false, //合规审查
      declareShow: false, //申报审核
      meetingShow: false, //会议详情
      onlineShow: false, //在线预审
      resultsShow: false, //三方审批结果
      summaryShow: false, //意见汇总
      turntosendShow: false, //转派三方
      arrangeMeetingShow: false, //安排评审会议
      editShow: false, //方案修改
      projectAuditShow: false, //申报审核，转年度
      turnThreeAuditDialogShow: false, //抽取专家，转三方
      createMsgDialogShow: false, //催办
      timeData:'',//在线预审查看时 查询时间参数
      approvalId:'',
      leftTab: [
        { label: "项目申报", check: "0" },
        { label: "方案申报", check: "1" },
        { label: "项目实施", check: "2" },
        { label: "项目验收", check: "3" },
        { label: "审核进程", check: "4" },
        { label: "审批", check: "5" },
      ],
      checkActive: 0,
      tableData: {},
      //审批进度列表
      approvalsList: [],
      //审核进程 默认的操作表1
      defaultLable: [
        { approvalStage: "项目申报", approvalNode: "申报提交" },
        { approvalStage: "项目申报", approvalNode: "申报审核" },
        { approvalStage: "方案申报", approvalNode: "方案申报", showNode: true},
        { approvalStage: "方案申报", approvalNode: "安排评审会议", showNode: true },
        { approvalStage: "方案申报", approvalNode: "接受任务" ,isThird:false, showNode: true},
        { approvalStage: "方案申报", approvalNode: "在线预审" ,isThird:false, showNode: true},
        { approvalStage: "方案申报", approvalNode: "意见汇总" ,isThird:false, showNode: true},
        { approvalStage: "方案申报", approvalNode: "现场论证" ,isThird:false, showNode: true },
        { approvalStage: "方案申报", approvalNode: "方案修改", show: false, isThird:false, showNode: true },
        { approvalStage: "方案申报", approvalNode: "三方预审审核", show: false, showNode: true },
        { approvalStage: "方案申报", approvalNode: "三方审批" , show: false,isThird:true, showNode: true },
        { approvalStage: "方案申报", approvalNode: "三方论证审核", show: false,isThird:true, showNode: true },
        { approvalStage: "方案申报", approvalNode: "初设及概算方案批复", showNode: true },
        { approvalStage: "项目实施", approvalNode: "合同备案", showNode: true },
        { approvalStage: "项目实施", approvalNode: "里程碑管理", showNode: true },
        { approvalStage: "项目实施", approvalNode: "合规审查", showNode: true },
        { approvalStage: "项目实施", approvalNode: "初验备案", showNode: true },
        { approvalStage: "项目验收", approvalNode: "终验备案", showNode: true },
        { approvalStage: "项目验收", approvalNode: "绩效考评", showNode: true },
      ],
      spanArr: [], //存放合并信息
      pos: 0,
      proid: "", //项目id
      // 里程碑信息列表
      milestoneList: [],
      finance: null,//发改委/财政
      schemeDeclaration: null,
      reviewType: "", //项目属性 0 方案评审 1 年度计划
      type: "", // 安排评审会议 0 没操作 1 已操作
      turntosendName: "", //转派三方项目名
      nature: "", //项目性质
      AnnualDeclaration:null, //年度计划
      SupplementaryDeclaration: null, //申报计划
      systemInfoList: null, //系统信息
      governmentDataResourcesVoList:null, //政务目录清单
      cloudResourceRequirementVoList: null, //云资源需求
      iotDeviceInfoVoList: null, //物联设备信息
      contractInformation: null,//合同信息
      preliminaryInformation: null,//初验信息
      compliance: null,//合规审查
      lastCheck:null,//终验
      show:false,//三方审批弹窗是否展示三方审批意见
      isThirdShow:false,//是否是三方展示默认节点
      showNode: true, //根据项目类别判断节点的显隐
      auditData:{}, //审批按钮判断数据
      isDisable:false //审批按钮是否可以点击
    };
  },
  created() {
    this.$nextTick(() => {
      this.proid = this.$route.query.id;
      this.showEdit = this.$route.query.name === "name";
      if (this.showEdit) {
        this.leftTab.splice(4, 2);
      }
      this.getDetaillsData().then(()=>{
        this.handIsDisable();
      });
    });
  },
  mounted() {
    this.getSpanArr(this.approvalsList);
    this.$nextTick(()=>{
      window.addEventListener('scroll', this.windowScroll)
    })
  },
  methods: {
    //下载文件
    downloadSomeFile(file) {
      console.log(file)
      if (file) {
        window.location.href = file.fileUrl;
      }
    },
    checkTab(id) {
      this.checkActive = id;
      this.$nextTick(() => {
        // console.log(11, this.$refs.one.offsetTop);
        // console.log(22, this.$refs.two.offsetTop);
        // console.log(33, this.$refs.three.offsetTop);
        // console.log(1010, this.$refs.ten.offsetTop);
      });
      //项目申报
      if (this.checkActive == 0) {
        window.scrollTo({
          top: this.$refs.one.offsetTop - 81,
          behavior: "smooth",
        });
      }
      //方案申报
      if (this.checkActive == 1) {
        window.scrollTo({
          top: this.$refs.three.offsetTop + 24,
          behavior: "smooth",
        });
      }
      //项目实施
      if (this.checkActive == 2) {
        window.scrollTo({
          top: this.$refs.five.offsetTop + 24,
          behavior: "smooth",
        });
      }
      //项目验收
      if (this.checkActive == 3) {
        window.scrollTo({
          top: this.$refs.seven.offsetTop + 24,
          behavior: "smooth",
        });
      }
      //审核进程
      if (this.checkActive == 4) {
        window.scrollTo({
          top: this.$refs.ten.offsetTop + 24,
          behavior: "smooth",
        });
      }
      //审批按钮
      if (this.checkActive == 5) {
        window.scrollTo({
          top: this.$refs.handleBtn.offsetTop + 24,
          behavior: "smooth",
        });
      }
    },
    /** 格式化时间 */
    formatDate(val) {
      if(val){
        return val.substring(0, 10);
      }
    },
    /** 获取项目详情 */
    getDetaillsData() {
    return getManageDetails(this.proid).then((res) => {
        console.log(res, "resssssssssss");
        this.isThirdShow=res.isThird==1?true:false
        this.tableData = res;
        this.auditData = res.data
        this.nature = res.data.nature;
        //对项目阶段判断，如果没有哪个阶段，对应删除左侧边栏
        if (!this.tableData.SchemeDeclaration) {
          let index = this.leftTab.findIndex((item) => item.check == "1");
          this.leftTab.splice(index, 1);
        }
        if (!this.tableData.ContractInformation) {
          let index = this.leftTab.findIndex((item) => item.check == "2");
          this.leftTab.splice(index, 1);
        }
        if (!this.tableData.Compliance) {
          let index = this.leftTab.findIndex((item) => item.check == "3");
          this.leftTab.splice(index, 1);
        }
        //根据项目类别判断节点的显隐
        if(this.tableData.data.type !== '3'){
          this.showNode=true   
        } else {
          this.showNode=false
        }
        //年度计划
        if(res.AnnualDeclaration&&res.AnnualDeclaration != null){
          this.AnnualDeclaration = res.AnnualDeclaration;
        }
        //增补项目
        if(res.SupplementaryDeclaration&&res.SupplementaryDeclaration != null){
          this.SupplementaryDeclaration = res.SupplementaryDeclaration;
        }
        //方案申报
        if (res.SchemeDeclaration && res.SchemeDeclaration!=null) {
          this.schemeDeclaration = res.SchemeDeclaration;

          //系统信息
          if(res.SchemeDeclaration.systemInfoList&&res.SchemeDeclaration.systemInfoList != null){
            this.systemInfoList = res.SchemeDeclaration.systemInfoList;
          }
          console.log(this.systemInfoList)
          //政务目录清单
          if(res.SchemeDeclaration.governmentDataResourcesAddDtoList&&res.SchemeDeclaration.governmentDataResourcesAddDtoList != null){
            this.governmentDataResourcesVoList = res.SchemeDeclaration.governmentDataResourcesAddDtoList;
          }
          //云资源需求
          if(res.SchemeDeclaration.insertCloudResourceDtoList&&res.SchemeDeclaration.insertCloudResourceDtoList != null){
            this.cloudResourceRequirementVoList = res.SchemeDeclaration.insertCloudResourceDtoList;
          }
          //物联设备
          if(res.SchemeDeclaration.insertIotDeviceInfoDtosList&&res.SchemeDeclaration.insertIotDeviceInfoDtosList != null){
            this.iotDeviceInfoVoList = res.SchemeDeclaration.insertIotDeviceInfoDtosList;
          }
        }
        this.reviewType = res.reviewType;
        this.type = res.type;
        
        //里程碑
        if (res.MilestoneInformation&&res.MilestoneInformation !=null) {
          this.milestoneList = res.MilestoneInformation;
        }
        // 初验信息
        if (res.PreliminaryInformation&&res.PreliminaryInformation !=null) {
          this.preliminaryInformation=res.PreliminaryInformation
        }
        // 终验
        if (res.LastCheck&&res.LastCheck !=null) {
          this.lastCheck=res.LastCheck
        }
        // 初设及概算方案批复
        if (res.Finance && res.Finance != null) {
          this.finance = res.Finance;
        }
        // 合同信息
        if (res.ContractInformation&&res.ContractInformation !=null) {
          this.contractInformation=res.ContractInformation
        }
        // 合规
        if (res.Compliance && res.Compliance != null) {
          this.compliance = res.Compliance;
        }
        // 审核进程
        if (res.Approval) {
          let data = [];
          this.defaultLable.map((item, index) => {
            let flag = false;
            res.Approval.map((item1) => {
              if (item.approvalNode == item1.approvalNode) {
                // if(this.isThirdShow==true){
                  // console.log(1234567897651643246541357465499)
                  // return 
                // }else{
                  data.push({ ...item, ...item1 });
                  data.sort(function(a,b) { 
                      return new Date(a.startTime).getTime() - new Date(b.startTime).getTime() 
                  });
                  flag = true;
                // }
              }
            });
            if (flag == false) {
              item.showNode = this.showNode
              if(item.show==false||(item.isThird==false&&res.isThird == 1) || item.showNode == false){
                if(item.isThird==false&&res.isThird == 1 || item.showNode == false){
                  return
                }else if(item.isThird==true&&res.isThird == 1){
                  data.push(item);
                }else {
                  return 
                }
              } else {
                data.push(item);
              }
            }
            this.approvalsList = data;
          });
        } else {
          this.approvalsList = this.defaultLable;
        }
        if (this.approvalsList) {
          this.getSpanArr(this.approvalsList);
          console.log('看一眼',this.approvalsList);
        }
      });
    },
    /** 对表格单列样式更改 */
    columnStyle({ row, column, rowIndex, columnIndex }) {
      if (columnIndex == 0) {
        //第1列的背景色就改变
        return "background:#f8f8f9";
      }
    },
    // 合并表格
    getSpanArr(data) {
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1);
          this.pos = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].approvalStage == data[i - 1].approvalStage) {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = i;
          }
        }
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        const _row = this.spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          // [0,0] 表示这一行不显示， [2,1]表示行的合并数
          rowspan: _row,
          colspan: _col,
        };
      }
    },
    /** 显示隐藏 弹窗操作*/
    handDialog(row, type) {
      console.log(row);
      // 现场论证 argumentShow
      // 合规审查 complianceShow
      // 申报审核 declareShow
      // 会议详情 meetingShow
      // 在线预审 onlineShow
      // 三方审批结果 resultsShow
      // 意见汇总 summaryShow
      // 转派三方 turntosendShow
      // 安排评审会议 arrangeMeetingShow
      //方案修改 editShow
      switch (row.approvalStatus) {
        case "16":
          this.argumentShow = true;
          break;
        case "34":
          this.complianceShow = true;
          break;
        case "1":
          this.declareShow = true;
          break;
        case "14":
          this.meetingShow = true;this.approvalId=row.approvalId;
          break;
        case "11":
          this.onlineShow = true;this.timeData=row.createTime;
          break;
        case "12":
          this.onlineShow = true;this.timeData=row.createTime;
          break;
        case "22":
          this.resultsShow = true;this.show=false;this.approvalId=row.approvalId;
          break;
        case "49":
          this.resultsShow = true;this.show=true;this.approvalId=row.approvalId;
          break;
        case "13":
          this.summaryShow = true;
          break;
        case "57":
          this.editShow = true;
          break;
          case "60":
          this.arrangeMeetingShow = true;this.timeData=row.createTime;//安排评审会议
          break;
        case "7":
          if (type == 1) {
            this.turntosendName =
              this.tableData.data.name + this.tableData.data.stag + "评审";
            this.turntosendShow = true;
            break;
          } else {
            this.$router.push({
              path: "/business_manage/manage/projectPlan",
              query: {
                info:
                  this.tableData.data.name +
                  row.approvalStage +
                  "评审." +
                  this.reviewType,
                projectId: row.projectId,
                enterType: 'manage'
              },
            });
            break;
          }
        case "41":
          this.$router.push({
            path: "/business_manage/manage/performance",
            query: {
              id: row.projectId,
            },
          });
          break;
        case "42":
          const id = row.projectId;
          this.$router.push({
            path: "/business_manage/manage/performance",
            query: {
              id: row.projectId,
            },
          });
          break;
        // case '待抽取专家':this.$router.push('/manage/manage/projectPlan');break;
        case "9":
          this.$router.push({
            path: "/business_manage/manage/expertsdraw/details",
            query: {
              id: this.tableData.data.reviewTaskId,
            },
          });
          break;
        case "10":
          this.$router.push({
            path: "/business_manage/manage/expertsdraw/details",
            query: {
              id: this.tableData.data.reviewTaskId,
            },
          });
          break;
        default:
          "";
          break;
      }
    },
    /** 现场论证 删除附件 */
    handleDel(approvalId){
      delFile(approvalId).then(res=>{
        if(res.code === 200){
          this.$message.success('删除成功')
          this.getDetaillsData()
        }
      })
    },
    /** 显示隐藏 弹窗操作 审批按钮*/
    handleAudit(){
      if(this.auditData.isState==='1'){
        this.projectAuditShow = true;   //左下角增补审核，转年度弹窗
      }else if(this.auditData.isState==='7' && this.type === '0'){
        this.turnThreeAuditDialogShow = true;   //左下角抽取专家，转三方弹窗
      }else if(this.auditData.isState==='13' && this.tableData.isThird === '0'){
        this.summaryShow = true;   //左下角意见汇总审批弹窗
      }else if(this.auditData.isState==='16' && this.tableData.isThird === '0'){
        this.argumentShow = true;   //左下角现场论证审批弹窗
      }else if(this.auditData.isState==='60' && this.tableData.isThird === '0'){
        this.arrangeMeetingShow = true;   //左下角安排评审会议弹窗
      }else if(this.auditData.isState==='34'){
        this.complianceShow = true;  //左下角合规审查审核弹窗
      }else if(this.auditData.isState==='22'){
        this.resultsShow = true;  //左下角三方审批弹窗
        this.show = false
      }else if(this.auditData.isState==='49'){
        this.resultsShow = true;  //左下角三方审批弹窗
        this.show = true
      }else if(this.auditData.isState==='57' && this.tableData.isThird === '0'){
        this.editShow = true;  //左下角方案修改审核弹窗
      }
    },
    /** 判断审批按钮是否可以点击 */
    handIsDisable(){
      if(this.auditData.isState==='1'||      
      this.auditData.isState==='60'||
      this.auditData.isState==='34'||
      this.auditData.isState==='22'||
      this.auditData.isState==='49'){
        this.isDisable=false;
        window.scrollTo({
          top: this.$refs.handleBtn.offsetTop -24,
          behavior: "smooth",
        });
      }else if(this.auditData.isState==='7' && this.type === '0'){
        this.isDisable=false;
        window.scrollTo({
          top: this.$refs.handleBtn.offsetTop -24,
          behavior: "smooth",
        });
      }else if(this.auditData.isState==='13' && this.tableData.isThird === '0'){
        this.isDisable=false;
        window.scrollTo({
          top: this.$refs.handleBtn.offsetTop -24,
          behavior: "smooth",
        });
      }else if(this.auditData.isState==='16' && this.tableData.isThird === '0'){
        this.isDisable=false;
        window.scrollTo({
          top: this.$refs.handleBtn.offsetTop -24,
          behavior: "smooth",
        });
      }else if(this.auditData.isState==='57' && this.tableData.isThird === '0'){
        this.isDisable=false;
        window.scrollTo({
          top: this.$refs.handleBtn.offsetTop -24,
          behavior: "smooth",
        });
      }else{
        this.isDisable=true;
      }
    },
    changeShowDialog(data) {
      if (data == "false") {
        this.argumentShow = false;
        this.complianceShow = false;
        this.declareShow = false;
        this.meetingShow = false;
        this.onlineShow = false;
        this.resultsShow = false;
        this.summaryShow = false;
        this.editShow = false;
        this.turntosendShow = false;
        this.arrangeMeetingShow=false;
        this.projectAuditShow=false;
        this.turnThreeAuditDialogShow = false;
        this.createMsgDialogShow = false;
      } else {
        this.argumentShow = true;
        this.complianceShow = true;
        this.declareShow = true;
        this.meetingShow = true;
        this.onlineShow = true;
        this.resultsShow = true;
        this.summaryShow = true;
        this.editShow = true;
        this.turntosendShow = true;
        this.arrangeMeetingShow=true;
        this.projectAuditShow=true;
        this.turnThreeAuditDialogShow = true;
        this.createMsgDialogShow = true;
      }
      //  this.getDetaillsData()
    },
    /** 获取滚动条的高度 */
    windowScroll() {
      // 滚动条距离页面顶部的距离
      // 以下写法原生兼容
      let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
      // console.log('滚动条高度',scrollTop);
        let two = this.$refs.two.offsetTop - 30
        let twoHeight = this.$refs.two.scrollHeight;
        if(scrollTop <= two + twoHeight){
          this.checkActive = 0
        }
        // 方案申报
        let three = this.$refs.tabsTwo.offsetTop - 30
        let threeHeight = this.$refs.tabsTwo.scrollHeight;
        if(this.schemeDeclaration && scrollTop>=three && scrollTop <= three + threeHeight){
            this.checkActive = 1
        }
        //项目实施
        let five = this.$refs.tabsThree.offsetTop -30
        let fiveHeight = this.$refs.tabsThree.scrollHeight;
        if (this.contractInformation && scrollTop>=five && scrollTop <= five + fiveHeight) {
          this.checkActive = 2
        }
        // 项目验收
        let seven = this.$refs.tabsFour.offsetTop -30
        let sevenHeight = this.$refs.tabsFour.scrollHeight;
        if (this.compliance && scrollTop>=seven && scrollTop <= seven + sevenHeight) {
          this.checkActive = 3
        }
        //审核进程
        let ten = this.$refs.ten.offsetTop - 30
        let tenHeight = this.$refs.ten.scrollHeight;
        if(scrollTop>=ten && scrollTop <= seven + tenHeight){
          this.checkActive = 4 
        }
    },
    // 催办
    createMsg() {
      // this.$confirm("是否确认发送系统催办通知 ？", "催办", {
      //   confirmButtonText: "确定",
      //   cancelButtonText: "取消",
      //   type: "warning",
      //   customClass: "del_box del_box_width",
      // })
      //   .then(()=> {
      //     return createMsg(projectId).then(res => {
      //       if (res.code === 200) {
      //         this.$message.success(res.msg)
      //       }
      //     }).catch(err => {
      //         console.log(err)
      //       })
      //   })
      this.createMsgDialogShow = true;
    }
  },
  beforeDestroy() {
    window.removeEventListener('scroll', this.windowScroll)
  },
};
</script>

<style lang="scss" scoped>
.container {
  width: 100%;
  background: #f5f5f5;
  padding: 16px;
  .container-content {
    padding: 24px;
    background: #fff;
    .title {
      font-size: 18px;
      font-family: PingFang SC, PingFang SC-Medium;
      font-weight: 500;
      color: #000000;
      line-height: 18px;
      text-align: left;
      display: flex;
      justify-content: space-between;
      .back-btn {
        margin-right: 56px;
        font-size: 14px;
        font-family: PingFang SC, PingFang SC-Regular;
        font-weight: 400;
        color: #333333;
        display: flex;
        align-items: center;
        cursor: pointer;
        img {
          margin-right: 7px;
        }
      }
    }
    .content-box {
      .step {
        margin-top: 24px;
        // display: flex;
        position: relative;
        // justify-content: flex-end;
        margin-left: 160px;
        width: 1440px;
        .right-box {
          // position: absolute;
          // right:0;
          .right-title {
            width: 1440px;
            height: 50px;
            line-height: 50px;
            display: flex;
            align-items: center;
            border: 1px solid #ebecef;
            border-right: 0;
            border-left: 0;
            font-size: 14px;
            font-family: PingFang SC, PingFang SC-Medium;
            font-weight: 500;
            text-align: LEFT;
            color: #333333;
            margin: 24px 0;
            img {
              margin-right: 6px;
            }
          }
          .right-title1 {
            display: flex;
            justify-content: space-between;
            > span {
              display: inline-block;
            }
            & > :last-child {
              .el-button {
                width: 130px;
                height: 32px;
                background: #ffffff;
                border: 1px solid #3171ee;
                box-sizing: border-box;
                border-radius: 4px;
                padding: 0;
                font-family: "PingFang SC";
                font-weight: 400;
                font-size: 14px;
                color: #3171ee;
              }
            }
          }
          .table-box {
            // margin:24px 0;
            // height:48px;
            display: flex;
            flex-wrap: wrap;
            font-size: 14px;
            & > div {
              display: flex;
              align-items: center;
            }
          }
          .table-box2 {
            // height:48px;
            display: flex;
            flex-wrap: wrap;
            margin-top: 24px;

            & > div {
              display: flex;
              align-items: center;
            }
          }
          .table-box3 {
            display: flex;
            margin-bottom: 24px;
            .left-table-tab {
              & > div {
                background: #fafafa;
                width: 160px;
                border: 1px solid #ebecef;
                display: flex;
                align-items: center;
                justify-content: center;
              }
            }
            .right-table-tab {
              width: 1280px;
              flex-wrap: nowrap;
              .content-right {
                display: flex;
                & > div {
                  width: 160px;
                  height: 48px;
                  line-height: 48px;
                  border: 1px solid #ebecef;
                  text-align: center;
                  border-top: 0;
                  border-left: 0;
                }
              }
            }
          }
        }
      }
      .step-box {
        width: 136px;
        text-align: center;
        border-left: 2px solid #f5f5f5;
        margin-right: 24px;
        position: fixed;
        div {
          height: 48px;
          line-height: 48px;
          font-size: 16px;
          font-family: PingFang SC, PingFang SC-Medium;
          font-weight: 500;
          cursor: pointer;
        }
        .active {
          color: #3171ee;
          position: relative;
          span {
            display: inline-block;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            border: 2px solid #3171ee;
            position: absolute;
            left: -5px;
            top: 19px;
          }
        }
      }
    }
    .table-header {
      display: inline-block;
      width: 240px;
      height: 48px;
      background: #fafafa;
      line-height: 48px;
      text-align: center;
      border: 1px solid #ebebeb;
    }
    .table-body {
      display: inline-block;
      width: 1201px;
      height: 48px;
      border: 1px solid #ebebeb;
      border-left: 0;
      text-indent: 24px;
      line-height: 48px;
    }
    .table-body1 {
      width: 240px;
    }
    .table-header2 {
      width: 360px;
    }
    .table-header3 {
      width: 288px;
    }
    .table-header4 {
      width: 160px;
    }
    .table-body2 {
      width: 360px;
    }
    .table-body3 {
      width: 288px;
    }
    .tips1 {
      width: 480px;
    }
    .tips2 {
      span {
        width: 720px;
      }
    }
    .tab1 {
      height: 96px;
    }
    .tab2 {
      height: 240px;
    }
    .tab3 {
      height: 144px;
    }
    .tab4 {
      height: 96px;
    }
    .height1 {
      // padding:44px 0;
      height: 108px;
      line-height: 108px;
    }
    .bodyHeight {
      // padding:24px 0;
      height: 108px;
      line-height: 16px;
      padding: 24px;
      font-family: PingFang SC, PingFang SC-Regular;
      font-weight: 400;
    }
    .blueColor {
      color: #3171ee;
    }
    .pointer {
      cursor: pointer;
    }
  }
  .downloadSpan{
    img{
      width: 16px;
      height: 16px;
      margin-right: 10px;
      position: relative;
      top: 4px;
    }
  }
}
.files-box{
  width: 100%;
  line-height: 36px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  float: left;
  cursor: pointer;
}
.files-upload{
  width: 80%;
  line-height: 36px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  float: left;
  cursor: pointer;
}
.icon-del{
  margin-top: 12px;
  margin-left: 5%;
}
</style>
<style lang="scss">
.el-descriptions__body .el-descriptions__table .el-descriptions-item__cell {
  text-align: center;
}
.rigth-manage-info{
    /* 信息描述组件样式更改 */
  .descriptions-item-label {
    width: 240px;
  }
  .descriptions-item-content {
    text-align: left !important;
    img {
      width: 16px;
      height: 16px;
      margin-right: 10px;
      position: relative;
      top: 4px;
    }
  }
  .cancel-border-top {
    border-top: 0 !important;
  }
  .cancel-border-bottom {
    border-bottom: 0 !important;
  }
  .descriptions-item-height {
    height: 108px;
  }
}
.del_box_width{
  width: 450px !important;
}
</style>
